/* eslint-disable react/prop-types */
// import { LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, Legend } from 'recharts';
import { LabelList, Pie, PieChart } from 'recharts';
import React from 'react';


const ReportCharts = (props) => {
  const data = props.data;
  return (
    <PieChart width={500} height={300}>
      <Pie data={data} dataKey='sum' nameKey='percentage' fill="#82ca9d" label>
        <LabelList dataKey='type' position="insideTop" ></LabelList>
      </Pie>
    </PieChart>
    // <LineChart width={500} height={300} data={props.data}>
    //   <CartesianGrid strokeDasharray="3 3" />
    //   <XAxis dataKey="name" />
    //   <YAxis />
    //   <Tooltip />
    //   <Legend />
    //   <Line type="monotone" dataKey="pv" stroke="#8884d8" activeDot={{ r: 8 }} />
    //   <Line type="monotone" dataKey="uv" stroke="#82ca9d" />
    // </LineChart>
  );
};

export default ReportCharts;
